<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"  
      xmlns:h="http://java.sun.com/jsf/html"  
      xmlns:f="http://java.sun.com/jsf/core"  
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:t="http://myfaces.apache.org/tomahawk">  

    <ui:composition template="/templates/layout.xhtml">
        <ui:define name="content">            
            <div class="block">
                <div class="navbar navbar-inner block-header">
                    <div class="muted pull-left">
                      Quản Lý Giáo Viên               
                    </div>
                </div>
                <div class="block-content collapse in">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h4 class="panel-title">
                                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                                    <fieldset>
                                        <legend>Tìm kiếm</legend>
                                    </fieldset>
                                </a>
                            </h4>
                        </div>
                        <div id="collapseOne" class="panel-collapse collapse in">
                            <div class="panel-body">
                                <div class="form-horizontal">

                                    <div class="control-group">
                                        <label class="control-label" for="txtLastName"><h:outputText value="Họ:"/> </label>
                                        <div class="controls">
                                            <h:inputText styleClass="span4" id="txtLastName"  value="#{teacherManageBean.lastName}"/>

                                        </div>
                                    </div>
                                    <div class="control-group">
                                        <label class="control-label" for="txtFirstName"><h:outputText value="Tên:"/> </label>
                                        <div class="controls">
                                            <h:inputText styleClass="span3" id="txtFirstName"  value="#{teacherManageBean.firstName}"/>
                                        </div>
                                    </div>


                                    <div class="control-group">
                                        <label class="control-label" for="txtMobile"><h:outputText value="SĐT:"/><i class="icon-headphones"></i> </label>
                                        <div class="controls">
                                            <h:inputText styleClass="span3" id="txtMobile"  value="#{teacherManageBean.mobile}"/>
                                        </div>
                                    </div>
                                </div>

                                <p>
                                    <t:commandLink styleClass="btn btn-primary" value="Tìm" action="#{teacherManageBean.search}" />
                                    <t:commandLink styleClass="btn" value="Reset" action="#{teacherManageBean.resetForm}" />
                                </p>

                            </div>
                        </div>
                    </div>



                </div>
            </div>

            <t:div styleClass="block">
                <t:div styleClass="navbar navbar-inner block-header">
                    <t:div styleClass="muted pull-left">Danh Sách Giáo Viên</t:div>
                </t:div>
                <t:div styleClass="block-content collapse in">
                    <t:div styleClass="span12">
                        <t:dataTable id="tblTeacher" value="#{teacherManageBean.pageData}" var="cursor" styleClass="table table-hover"
                                     preserveSort="true" rows="5" sortColumn="#{teacherManageBean.sort}" sortAscending="#{teacherManageBean.sortAscending}"
                                     >
                            <t:column>
                                <f:facet name="header">
                                </f:facet>
                                <t:selectOneRow groupName="selectRadioGroup" />
                            </t:column>
                            <t:column>
                                <f:facet name="header">
                                    <t:commandSortHeader columnName="ui.id" arrow="true" styleClass="sortColumn">
                                        <h:outputText value="ID"/>
                                    </t:commandSortHeader>
                                </f:facet>
                                <h:outputText value="#{cursor.ui.id}">
                                </h:outputText>
                            </t:column>
                            <t:column>
                                <f:facet name="header">
                                    <t:commandSortHeader columnName="ui.firstName" arrow="true" styleClass="sortColumn">
                                        <h:outputText value="Họ Và Tên"/>
                                    </t:commandSortHeader>
                                </f:facet>
                                  <h:outputText value="#{cursor.ui.lastName}"/>
                                  <h:outputText value=" " />
                                  <h:outputText value="#{cursor.ui.firstName}"/>
                            </t:column>
                             <t:column>
                                <f:facet name="header">
                                    <t:commandSortHeader columnName="ui.mobile" arrow="true" styleClass="sortColumn">
                                        <h:outputText value="Mobile"/>
                                    </t:commandSortHeader>
                                </f:facet>
                                <h:outputText value="#{cursor.ui.mobile}">
                                </h:outputText>
                            </t:column>
                             <t:column>
                                <f:facet name="header">
                                    <t:commandSortHeader columnName="ui.email" arrow="true" styleClass="sortColumn">
                                        <h:outputText value="Email"/>
                                    </t:commandSortHeader>
                                </f:facet>
                                <h:outputText value="#{cursor.ui.email}">
                                </h:outputText>
                            </t:column>
                           
                            
                            <f:facet name="footer">
                                <div styleClass="pagination pagination-left">
                                    <h:commandLink styleClass="btn btn-default" action="#{teacherManageBean.viewTeacher}" >
                                        <i class="icon-eye-open"></i> Xem
                                    </h:commandLink>
                                    <h:commandLink styleClass="btn btn-default" action="#{teacherManageBean.preUpdateTeacher}">
                                        <i class="icon-pencil icon-white"></i> Sửa
                                    </h:commandLink>
                                    <h:commandLink styleClass="btn btn-default" action="#{teacherManageBean.preaddTeacher}"><i class="icon-ok-sign"></i>Thêm</h:commandLink>
                                    
                                </div>
                                <t:div styleClass="pagination pagination-right">
                                    <ul>
                                        <li>
                                            <t:commandLink  value="Previous"
                                                            disabled="#{!teacherManageBean.hasPreviousPage}"
                                                            action="#{teacherManageBean.previousPage}"/>
                                        </li>

                                        <li>
                                            <t:commandLink  value="Next"
                                                            disabled="#{!teacherManageBean.hasNextPage}"
                                                            action="#{teacherManageBean.nextPage}" />
                                        </li>
                                        <li class="active"> <a href="#"><t:outputText value="#{teacherManageBean.rowCount} row(s)"/></a>
                                        </li>
                                    </ul>
                                </t:div>
                            </f:facet>
                        </t:dataTable>

                    </t:div>
                </t:div>

            </t:div>

            <t:inputHidden id="txtSelectedID" value="#{teacherManageBean.selectedId}"/>

            <script type="text/javascript" language="JavaScript">
                
               
                $("#ppsForm\\:tblTeacher input:radio").each(function() {
                    var radioSelect = $(this);
                    radioSelect.click(function() {
                        $("#ppsForm\\:txtSelectedID").val($(this).parent().parent().find("td").eq(1).html());
                    });
                });
            </script>
        </ui:define>
    </ui:composition>        

</html>  